小程序核心知识点 #

// 列表跳详情的时候, 会带上id, 比如 url="/detail/detail?id=xxxx"
// 如果此时切换到了detail页面的模式, 刷新数据就没有了
// 这个时候可以编辑detail页面的编译模式, 添加启动参数即可解决问题

// 示例
wx.request({
  url: "test.php", //仅为示例，并非真实的接口地址
  // 请求参数
  data: {
    x: "",
    y: "",
  },
  method: "get", // 请求类型
  header: {
    "content-type": "application/json", // 默认值
  },
  // 成功的回调
  success(res) {
    console.log(res.data);
  },
  // 失败的回调
  fail(error) {
    console.log(error);
  },
  // 不管是成功还是失败都会调用此方法
  complete() {
    console.log("done");
  },
});

// config.js
let env = "prod";
let baseUrl = "";
if (env === "dev") {
  // 本地地址
  baseUrl = "https://localhost:3009";
} else if (env === "prod") {
  baseUrl = "https://huruqing.cn:3009";
}

// 导出
export { baseUrl };

import { baseUrl } from "./config.js";

/**
 * 封装请求
 * url：请求地址
 * data：请求参数
 * method: 请求类型
 */

const request = (url, data, method) => {
  // 获取token,登录时存的
  let token = wx.getStorageSync("token");
  url = baseUrl + url;
  return new Promise((resolve, reject) => {
    // 请求
    wx.request({
      url,
      method,
      data,
      header: {
        "user-token": token,
      },
      success: (res) => {
        if (res.data.code == 666) {
          resolve(res.data);
        } else if (res.data.code == 603) {
          wx.removeStorageSync("token");
          wx.showModal({
            title: "提示",
            content: "登录已过期，是否重新登录",
            success(res) {
              if (res.confirm) {
                // 跳转到个人中心页面
                wx.switchTab({
                  url: "/pages/my/my",
                });
              } else if (res.cancel) {
                console.log("用户点击取消");
              }
            },
          });
        } else {
          reject(res.data.msg);
        }
      },
      fail: (err) => {
        reject("网络异常");
      },
    });
  });
};

const get = (url, data) => {
  return request(url, data, "get");
};

const post = (url, data) => {
  return request(url, data, "post");
};

export default {
  get,
  post,
};

// app.js

import request from "./utils/request.js";
App({
  onLaunch: function() {
    this.$get = request.get;
    this.$post = request.post;
  },
});

// my.js

// 获取app对象
const app = getApp();
Page({
  onShow() {
    this.getData();
  },

  // 发送请求
  getData() {
    let url = "xxxxx";
    let data = { xxx: xxx };
    app
      .$get(url, data)
      .then((res) => {
        console.log(res);
      })
      .catch((err) => {
        console.log(err);
      });
  },
});

Page({
  data: {
    count: 1,
  },

  changeCount() {
    // 获取data里count的值
    let count = this.data.count;
    // 加1
    this.setData({
      count: ++count,
    });
  },
});

Page({
  tapName: function(event) {
    // 小程序事件不能像vue那样传参,只能通过自定义属性来传参
    let username = event.target.dataset.username;
    console.log(username);
  },
});

// 普通页面跳转
wx.navigateTo({
  url: "/product/product",
});

// tab栏切换
wx.switchTab({
  url: "/index",
});

// 列表页
 <navigator wx:for="{{flowerList}}" class="flex item pl-10 bg-fff" url="/pages/detail/detail?id={{item.id}}"></navigator>
   
// 详情页
  onLoad: function (options) {
    console.log(options.flowerId);
  },   
    
// 参数为对象时,要先将对象转成字符串
  toDetail() {
    let obj = {useranme: 'zs',age:100};
    // 将对象转成json字符串
    let query = JSON.stringify(obj);
    // 传参
    wx.navigateTo({
      url: '/pages/detail/detail?query='+query,
    }) 
  },
    
 // 获取参数
  onLoad: function (options) {
    let obj = JSON.parse(options.query);
    console.log(obj);
  },    

wx.setStorage({
  key: "key",
  data: "value",
});

wx.getStorage({
  key: "key",
  success(res) {
    console.log(res.data);
  },
});

wx.setStorageSync("key", "value");

// 例子
let token = 'asdfasdfasjdflasdjf;asdf;asdfjsak;ldf';
wx.setStorageSync('token',token);

let token = wx.getStorageSync('token');

{
  code, iv, encryptedData;
}

import { baseUrl } from "./config.js"; 
const request = (url, data, method) => {
  // 获取token,登录时存的
  let token = wx.getStorageSync("token");
  url = baseUrl + url;
  return new Promise((resolve, reject) => {
    // 请求
    wx.request({
      url,
      method,
      data,
      // 把token加入到请求头
      header: {
        "user-token": token,
      },
      success: (res) => { 
        if (res.data.code == 666) {
          resolve(res.data);
        } else if (res.data.code == 603) {
          wx.removeStorageSync("token");
          wx.showModal({
            title: "提示",
            content: "登录已过期，是否重新登录",
            success(res) {
              if (res.confirm) {
                // 跳转到个人中心页面
                wx.switchTab({
                  url: "/pages/my/my",
                });
              } else if (res.cancel) {
                console.info("用户点击取消");
              }
            },
          });
        } else {
          // wx.dialog(res.data.msg);
          wx.showToast({
            title: res.data.msg,
            icon: 'none',
            duration: 1500
          }) 
        }
      },
      fail: (err) => { 
        wx.showToast({
          title: '网络异常',
          icon: 'none',
          duration: 1500
        })
      },
    });
  });
};

const get = (url, data) => {
  return request(url, data, "get");
};

const post = (url, data) => {
  return request(url, data, "post");
};

export default {
  get,
  post,
};

wx.getLocation({
  type: 'wgs84',
  success: (res) => {
    const latitude = res.latitude;
    const longitude = res.longitude;
  },
  fail: (err) => {
    this.setData({
      city: '定位失败,请手动选择'
    })
  }
})

// nav.wxml
<view class="header">
  <text bindtap="clickLeft">左按钮</text>
  <view class="title">{{title}}</view>
  <text class="button">右按钮</text>
</view>

// nav.js
Component({ 
  properties: {
    title: String
  }, 
  methods: {
    clickLeft() {
      this.triggerEvent('clickLeft');
  },  
}) 

// nav.wxss
page {
  background: #ebebeb;
}
.header {
  display: flex;
  height: 50px;
  background-color: green;
  justify-content: space-between;
  align-items: center;
  padding: 0 15px;
  color: #fff;
}